<ion-header>

  <ion-toolbar>
    <ion-title>Item Text</ion-title>
  </ion-toolbar>

</ion-header>


<ion-content class="outer-content">

<ion-list>
  <ion-list-header>
    List Header
  </ion-list-header>
  <ion-item>
    Item
  </ion-item>
  <ion-item-divider>
    Item Divider
  </ion-item-divider>
  <ion-item>
    Item
  </ion-item>
</ion-list>

  <ion-item>
    Plain Ol' div with some text
  </ion-item>

  <ion-item>
    Single line text that should have ellipses when it doesn't all fit in the item
  </ion-item>

  <ion-item no-lines>
    Single line item with no lines
  </ion-item>

  <ion-item text-wrap>
    Multiline text that should wrap when it is too long
    to fit on one line in the item. Attribute on .item
  </ion-item>

  <ion-item text-wrap color="secondary">
    <h1>H1 Title Text</h1>
    <p>Paragraph line 1</p>
  </ion-item>

  <ion-item text-wrap>
    <h2>H2 Title Text</h2>
    <p>Paragraph line 1</p>
  </ion-item>

  <ion-item text-wrap>
    <h3 ion-text color="primary">H3 Title Text</h3>
    <p>Paragraph line 1</p>
    <p ion-text color="secondary">Paragraph line 2 secondary</p>
  </ion-item>

  <ion-item text-wrap>
    <h4>H4 Title Text</h4>
    <p>Paragraph line 1</p>
    <p>Paragraph line 2</p>
    <p>Paragraph line 3</p>
  </ion-item>

  <ion-item>
    <ion-label>
      Item using inner ion-label
    </ion-label>
  </ion-item>

  <ion-item>
    <ion-label>
      ion-label
    </ion-label>
    <div item-content>
      [item-content]
    </div>
  </ion-item>

</ion-content>
